<template>
  <!-- 关联答案 -->
  <div>
    <!-- 基本信息 -->
    <div class="policy-main circulationInfo">
      <div class="base-mian-cell-title mt clearfix">
        <div class="left fl">
          <i></i>
          <span class="tips">基本信息</span>
        </div>
      </div>
      <el-form ref="form" :model="form" label-width="150px" style="overflow: hidden; padding: 20px 85px 0 30px">
        <el-col :span="8" class="common-box">
          <el-form-item label="流水号：">
            <el-input v-model="form.taskNo" placeholder="系统自动生成" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" class="common-box">
          <el-form-item label="申请人：">
            <el-input v-model="form.agentNo" placeholder="请输入" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" class="common-box">
          <el-form-item label="申请时间：">
            <el-date-picker disabled v-model="form.applyDate" type="datetime" placeholder="选择日期时间" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss">
            </el-date-picker>
          </el-form-item>
        </el-col>

      </el-form>
    </div>

    <!-- 影像信息 -->
    <div class="policy-main circulationInfo">
      <div class="base-mian-cell-title mt clearfix">
        <div class="left fl">
          <i></i>
          <span class="tips">影像信息</span>
        </div>
      </div>
      <el-form :model="form" label-width="150px" style="overflow: hidden; padding: 20px 85px 0 30px">
        <el-col :span="12" class="common-box">
          <el-form-item label="提交影像：">
              <viewer :images="images">
                <img v-for="src in images" :key="src" :src="src" style="width: 500px !important;">
                 <!-- <el-image :src="imageUrl"></el-image> -->
              </viewer>
          </el-form-item>
        </el-col>

        <el-col :span="12" class="common-box">
          <el-form-item label="ORC抽取结果：">
            <el-input disabled type="textarea" :rows="numRows"  v-model="form.ocrContent"></el-input>
          </el-form-item>
        </el-col>
      </el-form>
    </div>

    <!-- 咨询信息 -->
    <div class="policy-main circulationInfo">
      <div class="base-mian-cell-title mt clearfix">
        <div class="left fl">
          <i></i>
          <span class="tips">咨询信息</span>
        </div>
      </div>
      <el-form ref="form2" :model="form" label-width="150px" style="overflow: hidden; padding: 20px 85px 0 30px">
        <el-col :span="8" class="common-box">
          <el-form-item label="属性结果：">
            <el-input disabled type="textarea" :rows="2" v-model="form.propertyResult"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" class="common-box">
          <el-form-item label="体检分级：">
            <el-input v-model="form.gradedContent" disabled :maxlength="20"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" class="common-box">
          <el-form-item label="核保结论：">
            <el-input disabled type="textarea" :rows="2" v-model="form.underResult"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24" class="common-box">
          <el-form-item label="健康建议：">
            <el-input disabled type="textarea" :rows="10" v-model="form.healthAdvice" :maxlength="400"></el-input>
          </el-form-item>
        </el-col>
      </el-form>
    </div>

    <!-- 保存按钮 -->
    <el-row style="padding: 20px; background: #fff">
      <el-col :span="24" class="text_center">
        <el-button type="danger" @click="goBack">返回</el-button>
      </el-col>
    </el-row>

  </div>
</template>

<script>

import constant from "@/utils/constant";
import { getAssistantRecordInfosApi, getAssistantRecordInfoImageApi } from "@/api/medicalLibrary/assistantRecoed";

export default {
  components: {
  },
  data() {
    return {
      images: [
      ],
      imageUrl: '',
      diseaseRuleDic: [],
      projectCategoryDic: [],  //体检项对象.项目大类
      projectNameDic: [], //体检项对象.项目名称
      logicDic: [], //逻辑符
      form: {
        rulePkgCode: '',
        rulePkgName: '',
        // publishType: '1',
        remark: '',
      },
      // 来源
      type: "add",
      // 规则包信息
      filterText: "",
      treeData: [],
      defaultProps: {
        children: "children",
        label: "label",
        disabled: (data, node) => {
          if (data._disabled) return true
          if (node.level == 1 || node.level == 2) return true;
          let checkId = node.parent.childNodes.filter((item) => item.checked);
          if (checkId.length) {
            if (!node.checked) return true;
            else return false;
          }
          return false;
        },
      },
      maxRows: 32, // 设置文本框的最大行数
      // 版本号对应的优先级
      sortObj: {},
      // 列表
      tableData: [],
      loading: false,

      // 弹窗
      ruleVisible: false,
      currentType: ''
    };
  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val);
    },
  },
  created() {
    this.form = this.$route.query.rowData;
    this.getOcrImages(this.form);
  },
  activated() {
  },
  mounted() {
  },
  computed: {
    numRows() {
      // 根据文本内容计算当前文本框的行数
      const lines = this.form.ocrContent.split('\n').length;
      console.log('Math.min(this.maxRows, lines)',Math.min(this.maxRows, lines))
      return Math.max(this.maxRows, lines);
    },
  },
  methods: {
    // 处理列表数据，给列表添加排序_sort
    getOcrImages(form) {
      let params = {
        taskNo: form.taskNo,
      }
      getAssistantRecordInfoImageApi(params)
        .then(res => {
          this.imageUrl = URL.createObjectURL(res.data);
          this.images.push(this.imageUrl);
          console.log(this.images)
        })
        .catch(err => {
        });
    },
    tableDataHandle() {
      this.tableData.forEach(item => {
        item._sort = this.sortObj[item.ruleGroupVersionId];
      });
    },
    // 点击页面返回按钮
    goBack() {
      this.$router.push({
        path: "/home/maintenance/robouUnderwriting/aiAssistant/assistantRecord",
      });
    },
  },
};
</script>

<style lang="less" scoped>
.policy-main {
  background: #fff;

  .base-mian-cell-title {
    margin: 0px 20px;
    padding: 0 20px;
    height: 48px;
    line-height: 48px;
    border-bottom: 1px solid #e1e1e1;
    overflow: hidden;

    .left {
      .line {
        color: #f76767;
        float: left;
      }

      .tips {
        margin-left: 10px;
        font-weight: bold;
        float: left;
      }

      i {
        width: 2px;
        height: 16px;
        float: left;
        background: red;
        margin-top: 17px;
      }

      .input {
        display: inline-block;
        border: 1px solid #e1e1e1;
        line-height: 36px;
        background-color: #fff;
        margin: 0 20px;
        width: 200px;
        padding-left: 15px;
      }

      .el-input {
        /* width: 50%; */
        margin-left: 20px;

        .el-input__inner {
          height: 34px;
          width: 180%;
        }
      }
    }

    .right {
      padding: 0 10px;
      cursor: pointer;

      .el-icon-arrow-down {
        color: #999;
        font-size: 24px;
        line-height: 48px;
      }

      .transform {
        transform: rotate(270deg);
      }
    }
  }

  .mt {
    margin-top: 0px;
  }
}

/* 规则包信息 */
.content {
  display: flex;
  /* height: calc(100vh - 300px); */
  /* min-height: 450px; */
  height: 450px;
  margin: 20px 10px 0 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #eaeaea;
}

.left-tree {
  width: 300px;
  margin-right: 10px;
  border: 1px solid #e1e1e1;

  .tree-filter {
    padding: 20px 20px 0 20px;
  }
}

.right-main {
  flex: 1;
  overflow: auto;

  .btn-list {
    background: #f8f8f8;
    padding: 10px 0;
    margin-bottom: 10px;
  }
}

.handle-btn {
  cursor: pointer;
  color: #409eff;
  display: inline-block;
  padding: 0 8px;
}

/deep/ .el-tree {
  background: #fff !important;
  height: calc(100% - 100px);
  overflow: auto;
  margin-top: 20px;
  padding-top: 0px;
}

/deep/ .el-tree .el-tree-node__content .is-disabled {
  display: block !important;
}
</style>